<div class="data-sources-derive-inds c-f">
    <ul class="data-sources-derive-inds-tab">
        <li class="classification classification-focus j-classification f-l" id="j-tab-create"><span>创建计算列</span></li>
        <li class="classification j-classification f-l" id="j-tab-select"><span>快速选择计算列</span></li>
        <li class="classification j-classification f-l" id="j-tab-callback"><span>回调指标</span></li>
    </ul>

    <div class="norm-box" id="j-box-norm">
        <div class="description">
            <div class="description-create">
                点击左侧指标，可进入右侧区域，参与计算；当前支持的运算包括+、-、*、/、%
                <div class="derive-inds-error hide j-derive-inds-error"></div>
            </div>
            <div class="description-select hide">
                可双击左侧指标，进入右侧区域，生成对应指标的计算列
                <div class="derive-inds-error hide j-derive-inds-error"></div>
            </div>
        </div>
        <div class="ind-cal-setting f-l">
            {{each indList.data}}{{if $value.type == "COMMON"}}
            <div class="item ellipsis hover-bg">
                <span class="j-ori-item" data-input="{{$value.name}}" title="{{$value.name}}（{{$value.id}}）">{{$value.name}}</span>
                {{if $value.visible == 0}}<span class="icon-letter collect j-method-type" data-id="{{$value.id}}">{{indList.map[$value.methodType]}}</span>{{/if}}
            </div>
            {{/if}}{{/each}}
        </div>
        <div class="data-sources-derive-list">
            <div class="data-sources-derive-list-create f-l" >
                {{each indList.data}}
                {{if $value.type == "CAL"}}
                <div class="item j-derive-item">
                    <div class="form-common-text name">
                        <input type="text" value="{{$value.caption}}" id="{{$value.id}}" class="j-input-datasource-address" placeholder="衍生指标名">
                        <span class="form-common-text-validation hide j-validation">衍生指标名与公式不能为空</span>
                    </div>
                    =
                    <div class="form-common-text">
                        <input type="text" value="{{$value.formula}}" class="j-value" placeholder="衍生指标公式">
                        <span class="form-common-btn-extend form-common-btn-extend-absolute j-delete" title="删除此衍生指标">×</span>
                    </div>
                </div>
                {{/if}}
                {{/each}}
                {{if !hasDerive}}
                <div class="item j-derive-item">
                    <div class="form-common-text name">
                        <input type="text" class="j-input-datasource-address" placeholder="衍生指标名">
                        <span class="form-common-text-validation hide j-validation">衍生指标名与公式不能为空</span>
                    </div>
                    =
                    <div class="form-common-text">
                        <input type="text" class="j-value" placeholder="衍生指标公式">
                        <span class="form-common-btn-extend form-common-btn-extend-absolute j-delete" title="删除此衍生指标">×</span>
                    </div>
                </div>
                {{/if}}
                <div class="item">
                    <span class="text-btn fw-b j-add-derive"> + </span>
                </div>
                <div class="item hide j-derive-item-template">
                    <div class="form-common-text name">
                        <input type="text" class="j-input-datasource-address" placeholder="衍生指标名">
                        <span class="form-common-text-validation hide j-validation">衍生指标名与公式不能为空</span>
                    </div>
                    =
                    <div class="form-common-text">
                        <input type="text" class="j-value" placeholder="衍生指标公式">
                        <span class="form-common-btn-extend form-common-btn-extend-absolute j-delete" title="删除此衍生指标">×</span>
                    </div>
                </div>
            </div>
            <div class="data-sources-derive-list-select f-l hide j-data-sources-derive-list-select">
                <div class="item">
                    <label class="label-inds-item f-l">添加环比指标</label>
                    <div class="area-inds-item j-area-inds-item-rr f-l">
                        {{each indList.data}}
                        {{if $value.type == "RR"}}
                        <div class="area-inds-item-ind j-area-inds-item-ind f-l" id="{{$value.id}}" title="{{$value.caption}}" name="{{$value.name}}">
                            {{$value.caption}}
                        <span class="hide area-inds-item-ind-delete">
                            x
                        </span>
                        </div>
                        {{/if}}
                        {{/each}}
                        <input type="text" class="input-inds-item f-l"/>
                    </div>
                </div>
                <div class="item">
                    <label class="label-inds-item f-l">添加同比指标</label>
                    <div class="area-inds-item j-area-inds-item-sr f-l">
                        {{each indList.data}}
                        {{if $value.type == "SR"}}
                        <div class="area-inds-item-ind j-area-inds-item-ind f-l" id="{{$value.id}}" title="{{$value.caption}}" name="{{$value.name}}">
                            {{$value.caption}}
                        <span class="area-inds-item-ind-delete hide">
                            x
                        </span>
                        </div>
                        {{/if}}
                        {{/each}}
                        <input type="text" class="input-inds-item f-l"/>
                    </div>
                </div>
            <span class="select-description f-l">
                描述：双击左侧指标后进入右侧，新指标以标签的形式展现，移入出现删除按钮。添加后的指标出现在左侧指标区域
            </span>
            </div>
        </div>
    </div>
    <div class="norm-box" id="j-box-callbackIndex" style="display: none;">
        <div class="description" style="padding: 18px 0 6px 13px">
            <div class="description-create">
                设置回调指标区域，在下方进行设置
                <div class="derive-inds-error hide j-derive-inds-error"></div>
            </div>
        </div>
        <div class="callback-index">
            <div class="callback-index-all j-callback-index-all">
                {{each indList.data}}{{if $value.type == "CALLBACK"}}
                <div class="callback-form-box">
                    <div class="callback-form" id="{{$value.id}}">
                        <div class="callback-name">
                            <div>回调指标名称:</div>
                            <div>显示名称:</div>
                            <div>回调地址:</div>
                            <div>请求超时时间:</div>
                        </div>
                        <div class="callback-text">
                            <input class="call-name call-text" placeholder="由数字,字母,下划线组成并以数字开头" title="由数字,字母,下划线组成并以数字开头" value="{{$value.name}}"/>
                            <input class="call-caption call-text" placeholder="由数字,字母,汉字组成" title="由数字,字母,汉字组成" value="{{$value.caption}}"/>
                            <input class="call-url call-text" placeholder="回调地址" title="回调地址" value="{{$value.url}}"/>
                            <input class="call-timeout call-text" placeholder="由整数组成" value="{{$value.properties.timeOut}}" />
                        </div>
                    </div>
                    <div class="close-retractable j-callback-close" title="删除">×</div>
                    <div class="close-retractable j-callback-retractable " title="收进">-</div>
                    <div class="callback-title"><div></div><div></div></div>
                </div>
                {{/if}}{{/each}}
            </div>
        </div>
        <div class="callback-add j-callback-add" title="添加">+</div>
    </div>
</div>